<template>
	<view class="container">
		<view class="banner">
			<uv-swiper
				:list="bannerList"
				keyName="image"
				indicator
				indicatorMode="dot"
				circular
				height="310"
				radius="0"
			></uv-swiper>
		</view>
		<view class="section">
			<view class="search p-40">
				<uv-search
					placeholder="请输入搜索内容"
					v-model="keyword"
					bgColor="#fff"
					@onSearch="onSearch"
					@custom="onSearch"
					@clear="onSearch"
				></uv-search>
			</view>
			<view class="section-content">
				<block v-for="(plan, index) in planList" :key="index">
					<uv-line color="#fff"></uv-line>
					<view class="course">
						<view class="p-40" style="display: flex">
							<view class="course__title">
								<image src="/static/img/dian.png" />
								<view>{{ plan.name }}</view>
							</view>
							<view class="course__look-btn">
								<uv-button
									text="查看"
									color="#9CBCE3"
									size="small"
									shape="circle"
									@click="download(plan.file)"
								></uv-button>
							</view>
						</view>
					</view>
				</block>
			</view>
		</view>
	</view>
</template>

<script>
import { getBannerList, getTrainingPlanList } from '@/api/index';

export default {
	data() {
		return {
			bannerList: [],
			planList: [],
			keyword: '',
			page: 1,
			limit: 10,
			all: false,
		};
	},
	onShareAppMessage() {},
	onShareTimeline() {},
	onLoad() {
		this.getInit();
	},
	onShow() {},
	onReachBottom() {
		if (this.all == true) {
			return false;
		}
		this.page++;
		this.getPlanData();
	},
	onPullDownRefresh() {
		this.getInit();

		this.page = 1;
		this.planList = [];
		this.all = false;
		this.getPlanData();
	},
	methods: {
		getInit() {
			//轮播图
			getBannerList({ location: 'plan' }).then((res) => {
				this.bannerList = res.data;
			});

			this.getPlanData();
		},
		getPlanData() {
			const param = {
				page: this.page,
				limit: this.limit,
				keyword: this.keyword,
			};
			getTrainingPlanList(param).then((res) => {
				this.planList = this.planList.concat(res.data.data);
				if (this.page == res.data.last_page) {
					this.all = true;
				}
				uni.stopPullDownRefresh();
			});
		},
		onSearch() {
			this.all = false;
			this.page = 1;
			this.planList = [];
			this.getPlanData();
		},
		download(file) {
			this.$tools.downloadFile(file);
		},
	},
};
</script>

<style lang="scss">
@import 'index.scss';
</style>
